<#include "../common/_public.html"/>
<html>
<head>
    <title>用 户 注 册</title>
    <link rel="stylesheet" type="text/css" href="${base}/layui/css/myCss/style.css" />
    <link rel="stylesheet" type="text/css" href="${base}/layui/css/layui.css" />
    <link rel="stylesheet" type="text/css" href="${base}/layui/css/myCss/login.css" />
    <script src="${base}/layui/lay/js/modernizr.custom.63321.js"></script>
    <script src="${base}/layui/layui.js"></script>
</head>
<body>
<div class="container">

    <header>
        <h1>XXX业务系统</h1>
        <h2>Background Management System Registration</h2>
    </header>
    <form class="layui-form" id="registration_from" >
        <div class="layadmin-user-login-box layadmin-user-login-body layui-form">
            <div class="layui-form-item">
                <label class="layadmin-user-login-icon layui-icon layui-icon-username" for="LAY-user-registration-username"></label>
                <input type="text" name="userName" id="LAY-user-registration-username" lay-verify="loginName" placeholder="登录名" class="layui-input">
            </div>
            <div class="layui-form-item">
                <label class="layadmin-user-login-icon layui-icon layui-icon-user" ></label>
                <input type="text" name="uNickname" id="LAY-user-NickName" placeholder="昵称" class="layui-input">
            </div>
            <div class="layui-form-item">
                <label class="layadmin-user-login-icon layui-icon layui-icon-password" for="LAY-user-login-password"></label>
                <input type="password" name="uPassword" id="LAY-user-registration-password" lay-verify="pass" placeholder="密码" class="layui-input">
            </div>
            <div class="layui-form-item">
                <label class="layadmin-user-login-icon layui-icon layui-icon-auz" ></label>
                <input type="password" id="LAY-user-registration-rePassword" lay-verify="required" placeholder="确认密码" class="layui-input">
            </div>
            <div class="layui-form-item">
                <input class="layui-btn layui-btn-fluid" lay-submit lay-filter="user_registration" type="submit" value="注 册"/>
            </div>
            <div class="layui-trans layui-form-item layadmin-user-login-other">
                <label>社交账号登入</label>
                <a href="javascript:;"><i class="layui-icon layui-icon-login-qq"></i></a>
                <a href="javascript:;"><i class="layui-icon layui-icon-login-wechat"></i></a>
                <a href="javascript:;"><i class="layui-icon layui-icon-login-weibo"></i></a>
            </div>
        </div>
    </form>
</div>
</body>
</html>
<script>
    //Demo
    layui.use('form', function(){
        var form = layui.form,
                $ = layui.$;

        form.verify({
            loginName:function (value) {
                if(!new RegExp("^[a-zA-Z]{1}").test(value)){
                    return '用户名第一位不能是数字或特殊字符';
                }
                if(value.length < 5){
                    return '用户名最少包含5个字符';
                }
                if (!new RegExp("^[a-zA-Z]{1}[a-zA-Z0-9_]{4,}$").test(value)){
                    return '用户名不能含有特殊字符';
                }
            }
            ,pass: [/(.+){6,18}$/, '密码必须6到12位']
        });

        //监听提交
        form.on('submit(user_registration)', function(data){
            var pass = $("#LAY-user-registration-password").val();
            var repass = $("#LAY-user-registration-rePassword").val();
            if(repass != pass){
                layer.msg("两次密码输入不一致",{
                    icon:5,
                    time:2000,
                    shift: 6
                });
                return false;
            }
            $.ajax({
                url:'${base}/admin/login_registration.do',
                type:'post',
                data:$("#registration_from").serialize(),
                dataType:"json",
                success:function(result) {
                    if(result.statusCode == 200){
                        layer.msg(result.message,{
                            icon:1,
                            time:1500
                        }, function(){
                            window.location.href='${base}/admin/login_toLogin.do';
                        })
                    }else if(result.statusCode == 300){
                        layer.msg(result.message,{
                            icon:2,
                            time:2000
                        });
                    }
                }
            });
            return false;
        });

    });
</script>